<template>
   <div>

     <el-form :inline="true" :model="form1" class="demo-form-inline">
       <el-form-item label="">
         <el-input v-model="form1.name" placeholder="楼盘名称/楼盘地址"></el-input>
       </el-form-item>
       <el-form-item label="">
         <el-select v-model="form1.premises_type" placeholder="请选择物业类型">
           <el-option
             v-for="item in options4"
             :key="item.value"
             :label="item.label"
             :value="item.value">
           </el-option>
         </el-select>
       </el-form-item>
       <el-select v-model="form1.province" placeholder="省" @change="getshi">
         <el-option
           v-for="item in options"
           :key="item.region_ID"
           :label="item.region_NAME"
           :value="item.region_ID"
          >
         </el-option>
       </el-select>
       <el-select v-model="form1.city" placeholder="市" @change="getxian">
         <el-option
           v-for="item in options2"
           :key="item.region_ID"
           :label="item.region_NAME"
           :value="item.region_ID"
         >
         </el-option>
       </el-select>
       <el-select v-model="form1.county" placeholder="县">
         <el-option
           v-for="item in options3"
           :key="item.region_ID"
           :label="item.region_NAME"
           :value="item.region_ID"
         >
         </el-option>
       </el-select>
       <el-form-item>
         <el-button type="primary" @click="getloupanlist"  icon="el-icon-search">查询</el-button>
       </el-form-item>
     </el-form>
     <el-button type="warning" icon="el-icon-plus" @click="addone">新增</el-button>
     <el-button type="warning" icon="el-icon-edit" @click="xiugai">修改</el-button>
   <!--修改的dia-->
     <el-dialog
       title="提示"
       :visible.sync="dialogVisible2"
       width="80%">
       <el-tabs style="margin-top: 50px;margin-left: 50px">
         <el-tab-pane label="基本信息" name="first">
           <el-form :model="ruleForm2"  ref="ruleForm" label-width="100px" class="demo-ruleForm">
             <el-form-item label="楼盘名称" prop="name">
               <el-input v-model="ruleForm2.name" style="width: 50%" ></el-input>
             </el-form-item>
             <el-form-item label="楼盘地址" prop="address">
               <el-input v-model="ruleForm2.address" style="width: 50%"></el-input>
             </el-form-item>
             <el-form-item label="城市地区" prop="sheng">
               <el-select v-model="ruleForm2.province" placeholder="省" @change="getshi2">
                 <el-option
                   v-for="item in options5"
                   :key="item.region_ID"
                   :label="item.region_NAME"
                   :value="item.region_ID">
                 </el-option>
               </el-select>
               <el-select v-model="ruleForm2.city" placeholder="市" @change="getxian2">
                 <el-option
                   v-for="item in options6"
                   :key="item.region_ID"
                   :label="item.region_NAME"
                   :value="item.region_ID"
                 >
                 </el-option>
               </el-select>
               <el-select v-model="ruleForm2.county" placeholder="县" @change="getshangquanDa">
                 <el-option
                   v-for="item in options7"
                   :key="item.region_ID"
                   :label="item.region_NAME"
                   :value="item.region_ID">

                 </el-option>
               </el-select>
             </el-form-item>
             <el-form-item label="商圈">
               <el-checkbox v-for="sq in shangquan" :label="sq.id" :key="sq.id" v-model="ruleForm2.sqa"> {{sq.name}}</el-checkbox>
             </el-form-item>
             <el-form-item label="地铁">
               <el-checkbox v-for="sub in subwaylist" :key="sub.id" class="dtt" :label="sub.id" v-model="ruleForm2.dt">{{sub.subway}}</el-checkbox>
             </el-form-item>
             <el-form-item label="建筑面积" prop="mainji">
               <el-input v-model="ruleForm2.proportion" placeholder="建筑面积"></el-input>
             </el-form-item>
             <el-form-item label="建筑类型">
               <el-checkbox v-model="ruleForm2.jianzhu" label="板楼">板楼</el-checkbox>
               <el-checkbox v-model="ruleForm2.jianzhu" label="塔楼">塔楼</el-checkbox>
               <el-checkbox v-model="ruleForm2.jianzhu" label="板塔结合">板塔结合</el-checkbox>
               <el-checkbox v-model="ruleForm2.jianzhu" label="底层">底层</el-checkbox>
               <el-checkbox v-model="ruleForm2.jianzhu" label="多层">多层</el-checkbox>
               <el-checkbox v-model="ruleForm2.jianzhu" label="高层">高层</el-checkbox>
             </el-form-item>
             <el-form-item label="社区类型">
               <el-select v-model="ruleForm2.she" placeholder="请选择社区类型" style="width: 50%">
                 <el-option label="小型社区" value="0">
                 </el-option>
                 <el-option label="中型社区" value="1">
                 </el-option>
                 <el-option label="大型社区" value="2">
                 </el-option>
               </el-select>
             </el-form-item>
             <el-form-item label="物业类型">
               <el-checkbox v-model="ruleForm2.wytype" label="0">普通住宅</el-checkbox>
               <el-checkbox v-model="ruleForm2.wytype" label="1">公寓</el-checkbox>
               <el-checkbox v-model="ruleForm2.wytype" label="2">商住两用</el-checkbox>
               <el-checkbox v-model="ruleForm2.wytype" label="3">商业地产</el-checkbox>
               <el-checkbox v-model="ruleForm2.wytype" label="4">写字楼</el-checkbox>
             </el-form-item>
             <el-form-item label="楼盘特色">
               <el-checkbox v-model="ruleForm2.tese" label="品牌企业">品牌企业</el-checkbox>
               <el-checkbox v-model="ruleForm2.tese" label="科技住宅">科技住宅</el-checkbox>
               <el-checkbox v-model="ruleForm2.tese" label="核心地段">核心地段</el-checkbox>
               <el-checkbox v-model="ruleForm2.tese" label="精装修">精装修</el-checkbox>
               <el-checkbox v-model="ruleForm2.tese" label="地铁沿线">地铁沿线</el-checkbox>
               <el-checkbox v-model="ruleForm2.tese" label="低总价">低总价</el-checkbox>
               <el-checkbox v-model="ruleForm2.tese" label="学区房">学区房</el-checkbox>
               <el-checkbox v-model="ruleForm2.tese" label="小户型">小户型</el-checkbox>
               <el-checkbox v-model="ruleForm2.tese" label="改善型住宅">改善型住宅</el-checkbox>
               <el-checkbox v-model="ruleForm2.tese" label="宜居社区">宜居社区</el-checkbox>
               <el-checkbox v-model="ruleForm2.tese" label="跃居">跃居</el-checkbox>
               <el-checkbox v-model="ruleForm2.tese" label="高层">高层</el-checkbox>
             </el-form-item>
             <el-form-item label="容积率" >
               <el-input v-model="ruleForm2.grossPlotRatio" placeholder="容积率" style="width: 50%" ></el-input>平方米
             </el-form-item>
             <el-form-item label="得房率">
               <el-input v-model="ruleForm2.efficiency" placeholder="容积率" style="width: 50%"></el-input>%
             </el-form-item>
             <el-form-item label="绿化率">
               <el-input v-model="ruleForm2.greenCoverage" placeholder="容积率" style="width: 50%"></el-input>%
             </el-form-item>
             <el-form-item label="楼栋数">
               <el-input v-model="ruleForm2.buildingCount" placeholder="容积率" style="width: 50%"></el-input>栋
             </el-form-item>
             <el-form-item label="开发商">
               <el-input v-model="ruleForm2.developer" placeholder="容积率" style="width: 50%"></el-input>
             </el-form-item>
             <el-form-item label="物业管理公司">
               <el-input v-model="ruleForm2.estate" placeholder="物业管理公司" style="width: 50%"></el-input>
             </el-form-item>
             <el-form-item label="楼盘简介">
               <el-input type="textarea" v-model="ruleForm2.introduce" placeholder="楼盘简介" style="width: 50%"></el-input>
             </el-form-item>
             <h1>周边配套</h1>
             <div v-for="(item, index) in ruleForm2.dynamicltem">
               <el-form-item
                 label="标题"
                 :prop="'dynamicltem.' + index + '.total'" >
                 <el-input v-model="item.total" style="width: 20%"></el-input>
               </el-form-item>
               <el-form-item
                 label="内容"
                 :prop="'dynamicltem.' + index + '.content'" >
                 <el-input v-model="item.content" style="width: 20%"></el-input>
               </el-form-item>
               <el-form-item>
                 <el-button v-if="index+1 == ruleForm2.dynamicltem.length" @click="addlf" type="primary">增加</el-button>
                 <el-button v-if="index !== 0" @click="removeDomain(item, index)" type="danger">删除</el-button>
               </el-form-item>
             </div>

             <h1>交通配套</h1>
             <div v-for="(item, index) in ruleForm2.dynamicltem2">
               <el-form-item
                 label="标题"
                 :prop="'dynamicltem2.' + index + '.total'" >
                 <el-input v-model="item.total" style="width: 20%"></el-input>
               </el-form-item>
               <el-form-item
                 label="内容"
                 :prop="'dynamicltem2.' + index + '.content'" >
                 <el-input v-model="item.content" style="width: 20%"></el-input>
               </el-form-item>
               <el-form-item>
                 <el-button v-if="index+1 == ruleForm2.dynamicltem2.length" @click="addlf2" type="primary">增加</el-button>
                 <el-button v-if="index !== 0" @click="removeDomain2(item, index)" type="danger">删除</el-button>
               </el-form-item>
             </div>
             <el-button @click="submit" style="margin-left: 40%;margin-top: 40px" type="primary">提交</el-button>


           </el-form>

         </el-tab-pane>
         <el-tab-pane label="相册管理" name="second">

           <el-form ref="form" :model="sizeForm" label-width="80px" size="mini">
             <h3>户型图:</h3>
             <el-upload
               class="upload-demo"
               action="https://jsonplaceholder.typicode.com/posts/"
               list-type="picture">
               <el-button size="small" type="primary">点击上传</el-button>
               <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
             </el-upload>
             <h3>外景图:</h3>
             <el-upload
               class="upload-demo"
               action="https://jsonplaceholder.typicode.com/posts/"
               list-type="picture"
             >
               <el-button size="small" type="primary">点击上传</el-button>
               <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
             </el-upload>
             <h3>施工图:</h3>
             <el-upload
               class="upload-demo"
               action="https://jsonplaceholder.typicode.com/posts/"
               list-type="picture">
               <el-button size="small" type="primary">点击上传</el-button>
               <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
             </el-upload>
             <h3>效果图:</h3>
             <el-upload
               class="upload-demo"
               action="https://jsonplaceholder.typicode.com/posts/"
               :on-success="addtupian"
               list-type="picture">
               <el-button size="small" type="primary">点击上传</el-button>
               <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
             </el-upload>
             <h3>首页图:</h3>
             <el-upload
               class="upload-demo"
               action="https://jsonplaceholder.typicode.com/posts/"
               list-type="picture">
               <el-button size="small" type="primary">点击上传</el-button>
               <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
             </el-upload>
           </el-form>
         </el-tab-pane>
       </el-tabs>
       <span slot="footer" class="dialog-footer">
    <el-button @click="dialogVisible2 = false">取 消</el-button>
    <el-button type="primary" @click="dialogVisible2 = false">确 定</el-button>
  </span>
     </el-dialog>
     <el-button @click="getsq">测试选中的数据</el-button>

     <el-table
       :data="tableData"
       style="width: 100%"
       @selection-change="handleSelectionChange"
      >
       <el-table-column
         prop="id"
         label="楼盘ID"
         width="100">
       </el-table-column>
       <el-table-column
         type="selection"
         width="55"
       >
       </el-table-column>
       <el-table-column
         prop="name"
         label="楼盘名称"
         width="180">
       </el-table-column>
       <el-table-column
         prop=""
         label="楼盘图片"
         width="180">
         <el-image></el-image>
       </el-table-column>
       <el-table-column
         prop="address"
         label="地址"
         width="180">
       </el-table-column>
       <el-table-column
         prop="premises"
         label="物业类型"
         width="180">
         <template scope="scope">
           <span v-if="scope.row.premises_type==0">普通住宅</span>
           <span v-if="scope.row.premises_type==1">公寓</span>
           <span v-if="scope.row.premises_type==2">商住两用</span>
           <span v-if="scope.row.premises_type==3">商业地产</span>
           <span v-if="scope.row.premises_type==4">写字楼</span>
         </template>
       </el-table-column>
       <el-table-column
         prop="estate"
         label="物业管理公司"
         width="180">
       </el-table-column>
     </el-table>
     <el-pagination
       @size-change="handleSizeChange"
       @current-change="handleCurrentChange"
       :current-page="this.form1.pageNum"
       :page-sizes="[10, 20, 30, 40]"
       :page-size="this.form1.pageSize"
       layout="total, sizes, prev, pager, next, jumper"
       :total="this.total">
     </el-pagination>


     <!-- 新增-->
     <el-dialog
       title="新增楼盘页面"
       :visible.sync="dialogVisible"
       width="60%">
       <el-tabs style="margin-top: 50px;margin-left: 50px">
         <el-tab-pane label="基本信息" name="first">
           <el-form :model="ruleForm"  ref="ruleForm" label-width="100px" class="demo-ruleForm">
             <el-form-item label="楼盘名称" prop="name">
               <el-input v-model="ruleForm.name" style="width: 50%"></el-input>
             </el-form-item>
             <el-form-item label="楼盘地址" prop="address">
               <el-input v-model="ruleForm.address" style="width: 50%"></el-input>
             </el-form-item>
             <el-form-item label="城市地区" prop="sheng">
               <el-select v-model="ruleForm.province" placeholder="省" @change="getshi2">
                 <el-option
                   v-for="item in options5"
                   :key="item.region_ID"
                   :label="item.region_NAME"
                   :value="item.region_ID"
                 >
                 </el-option>
               </el-select>
               <el-select v-model="ruleForm.city" placeholder="市" @change="getxian2">
                 <el-option
                   v-for="item in options6"
                   :key="item.region_ID"
                   :label="item.region_NAME"
                   :value="item.region_ID"
                 >
                 </el-option>
               </el-select>
               <el-select v-model="ruleForm.county" placeholder="县" @change="getshangquanDa">
                 <el-option
                   v-for="item in options7"
                   :key="item.region_ID"
                   :label="item.region_NAME"
                   :value="item.region_ID">

                 </el-option>
               </el-select>
             </el-form-item>
             <el-form-item label="商圈">
               <el-checkbox v-for="sq in shangquan" :label="sq.id" :key="sq.id" v-model="ruleForm.sqa"> {{sq.name}}</el-checkbox>
             </el-form-item>
             <el-form-item label="地铁">
               <el-checkbox v-for="sub in subwaylist" :key="sub.id" class="dtt" :label="sub.id" v-model="ruleForm.dt">{{sub.subway}}</el-checkbox>
             </el-form-item>
             <el-form-item label="建筑面积" prop="mainji">
               <el-input v-model="ruleForm.proportion" placeholder="建筑面积"></el-input>
             </el-form-item>
             <el-form-item label="建筑类型">
               <el-checkbox v-model="ruleForm.jianzhu" label="板楼">板楼</el-checkbox>
               <el-checkbox v-model="ruleForm.jianzhu" label="塔楼">塔楼</el-checkbox>
               <el-checkbox v-model="ruleForm.jianzhu" label="板塔结合">板塔结合</el-checkbox>
               <el-checkbox v-model="ruleForm.jianzhu" label="底层">底层</el-checkbox>
               <el-checkbox v-model="ruleForm.jianzhu" label="多层">多层</el-checkbox>
               <el-checkbox v-model="ruleForm.jianzhu" label="高层">高层</el-checkbox>
             </el-form-item>
             <el-form-item label="社区类型">
               <el-select v-model="ruleForm.she" placeholder="请选择社区类型" style="width: 50%">
                 <el-option label="小型社区" value="0">
                 </el-option>
                 <el-option label="中型社区" value="1">
                 </el-option>
                 <el-option label="大型社区" value="2">
                 </el-option>
               </el-select>
             </el-form-item>
             <el-form-item label="物业类型">
               <el-checkbox v-model="ruleForm.wytype" label="0">普通住宅</el-checkbox>
               <el-checkbox v-model="ruleForm.wytype" label="1">公寓</el-checkbox>
               <el-checkbox v-model="ruleForm.wytype" label="2">商住两用</el-checkbox>
               <el-checkbox v-model="ruleForm.wytype" label="3">商业地产</el-checkbox>
               <el-checkbox v-model="ruleForm.wytype" label="4">写字楼</el-checkbox>
             </el-form-item>
             <el-form-item label="楼盘特色">
               <el-checkbox v-model="ruleForm.tese" label="品牌企业">品牌企业</el-checkbox>
               <el-checkbox v-model="ruleForm.tese" label="科技住宅">科技住宅</el-checkbox>
               <el-checkbox v-model="ruleForm.tese" label="核心地段">核心地段</el-checkbox>
               <el-checkbox v-model="ruleForm.tese" label="精装修">精装修</el-checkbox>
               <el-checkbox v-model="ruleForm.tese" label="地铁沿线">地铁沿线</el-checkbox>
               <el-checkbox v-model="ruleForm.tese" label="低总价">低总价</el-checkbox>
               <el-checkbox v-model="ruleForm.tese" label="学区房">学区房</el-checkbox>
               <el-checkbox v-model="ruleForm.tese" label="小户型">小户型</el-checkbox>
               <el-checkbox v-model="ruleForm.tese" label="改善型住宅">改善型住宅</el-checkbox>
               <el-checkbox v-model="ruleForm.tese" label="宜居社区">宜居社区</el-checkbox>
               <el-checkbox v-model="ruleForm.tese" label="跃居">跃居</el-checkbox>
               <el-checkbox v-model="ruleForm.tese" label="高层">高层</el-checkbox>
             </el-form-item>
             <el-form-item label="容积率" >
               <el-input v-model="ruleForm.grossPlotRatio" placeholder="容积率" style="width: 50%" ></el-input>平方米
             </el-form-item>
             <el-form-item label="得房率">
               <el-input v-model="ruleForm.efficiency" placeholder="容积率" style="width: 50%"></el-input>%
             </el-form-item>
             <el-form-item label="绿化率">
               <el-input v-model="ruleForm.greenCoverage" placeholder="容积率" style="width: 50%"></el-input>%
             </el-form-item>
             <el-form-item label="楼栋数">
               <el-input v-model="ruleForm.buildingCount" placeholder="容积率" style="width: 50%"></el-input>栋
             </el-form-item>
             <el-form-item label="开发商">
               <el-input v-model="ruleForm.developer" placeholder="容积率" style="width: 50%"></el-input>
             </el-form-item>
             <el-form-item label="物业管理公司">
               <el-input v-model="ruleForm.estate" placeholder="物业管理公司" style="width: 50%"></el-input>
             </el-form-item>
             <el-form-item label="楼盘简介">
               <el-input type="textarea" v-model="ruleForm.introduce" placeholder="楼盘简介" style="width: 50%"></el-input>
             </el-form-item>
             <h1>周边配套</h1>
               <div v-for="(item, index) in ruleForm.dynamicltem">
                 <el-form-item
                   label="标题"
                   :prop="'dynamicltem.' + index + '.total'" >
                   <el-input v-model="item.total" style="width: 20%"></el-input>
                 </el-form-item>
                 <el-form-item
                   label="内容"
                   :prop="'dynamicltem.' + index + '.content'" >
                   <el-input v-model="item.content" style="width: 20%"></el-input>
                 </el-form-item>
                 <el-form-item>
                   <el-button v-if="index+1 == ruleForm.dynamicltem.length" @click="addlf" type="primary">增加</el-button>
                   <el-button v-if="index !== 0" @click="removeDomain(item, index)" type="danger">删除</el-button>
                 </el-form-item>
               </div>

             <h1>交通配套</h1>
             <div v-for="(item, index) in ruleForm.dynamicltem2">
               <el-form-item
                 label="标题"
                 :prop="'dynamicltem2.' + index + '.total'" >
                 <el-input v-model="item.total" style="width: 20%"></el-input>
               </el-form-item>
               <el-form-item
                 label="内容"
                 :prop="'dynamicltem2.' + index + '.content'" >
                 <el-input v-model="item.content" style="width: 20%"></el-input>
               </el-form-item>
               <el-form-item>
                 <el-button v-if="index+1 == ruleForm.dynamicltem2.length" @click="addlf2" type="primary">增加</el-button>
                 <el-button v-if="index !== 0" @click="removeDomain2(item, index)" type="danger">删除</el-button>
               </el-form-item>
             </div>
             <el-button @click="submit" style="margin-left: 40%;margin-top: 40px" type="primary">提交</el-button>


           </el-form>

         </el-tab-pane>
         <el-tab-pane label="相册管理" name="second">

           <el-form ref="form" :model="sizeForm" label-width="80px" size="mini">
             <h3>户型图:</h3>
             <el-upload
               class="upload-demo"
               action="https://jsonplaceholder.typicode.com/posts/"
               list-type="picture">
               <el-button size="small" type="primary">点击上传</el-button>
               <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
             </el-upload>
             <h3>外景图:</h3>
             <el-upload
               class="upload-demo"
               action="https://jsonplaceholder.typicode.com/posts/"
               list-type="picture"
             >
               <el-button size="small" type="primary">点击上传</el-button>
               <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
             </el-upload>
             <h3>施工图:</h3>
             <el-upload
               class="upload-demo"
               action="https://jsonplaceholder.typicode.com/posts/"
               list-type="picture">
               <el-button size="small" type="primary">点击上传</el-button>
               <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
             </el-upload>
             <h3>效果图:</h3>
             <el-upload
               class="upload-demo"
               action="https://jsonplaceholder.typicode.com/posts/"
               :on-success="addtupian"
               list-type="picture">
               <el-button size="small" type="primary">点击上传</el-button>
               <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
             </el-upload>
             <h3>首页图:</h3>
             <el-upload
               class="upload-demo"
               action="https://jsonplaceholder.typicode.com/posts/"
               list-type="picture">
               <el-button size="small" type="primary">点击上传</el-button>
               <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
             </el-upload>
           </el-form>
         </el-tab-pane>
       </el-tabs>
       <span slot="footer" class="dialog-footer">
    <el-button @click="dialogVisible = false">关闭</el-button>
  </span>
     </el-dialog>
   </div>
</template>

<script>
  import {loupanlist, getlistsheng, addloupan, getshisubway,getshangquan} from "../../api/system/loupan";

  export default {
        name: "LouPan.vue",
         data(){
          return{
            form1:{
              pageSize:10,
              pageNum:1,
              name:'',
              premises_type:'',
              province:'',
              city:'',
              county:''
            },
            //省市县需要用到的
            form2:{
              region_ID:'1',
            },
            form3:{
              region_ID:'',
            },
            form4:{
              region_ID:'',
            },
            total:0,
            tableData:[],
            options:[],
            options2:[],
            options3:[],
            //里面的三级联动代码
            options5:[],
            options6:[],
            options7:[],
            //这个是物业类型
           options4:[{
              value:'',
              label:'请选择'
           },{
             value:'0',
             label:'普通住宅'
           },{
             value:'1',
             label:'公寓'
           },{
             value:'2',
             label:'商住两用'
           },{
             value:'3',
             label:'商业地产'
           },{
             value:'4',
             label:'写字楼'}],
            dialogVisible:false,
            dialogVisible2:false,
            ruleForm:{
              name:"",
              address:"",
              province:"",
              city:"",
              county:"",
              sqa:[],
              dt:[],
              proportion:'',
              jianzhu:[],
              she:'',
              wytype:[],
              tese:[],
              grossPlotRatio:"",
              greenCoverage:"",
              buildingCount:"",
              efficiency:"",
              developer:"",
              estate:"",
              introduce:"",
              dynamicltem: [
                {
                  total: "",
                  content: "",
                }
              ],
              dynamicltem2:[
                {
                  total: "",
                  content: "",
                }
              ]
            },
            //修改要用到的值
            ruleForm2:{
              name:"",
              address:"",
              province:"",
              city:"",
              county:"",
              sqa:[],
              dt:[],
              proportion:'',
              jianzhu:[],
              she:'',
              wytype:[],
              tese:[],
              grossPlotRatio:"",
              greenCoverage:"",
              buildingCount:"",
              efficiency:"",
              developer:"",
              estate:"",
              introduce:"",
              dynamicltem: [
                {
                  total: "",
                  content: "",
                }
              ],
              dynamicltem2:[
                {
                  total: "",
                  content: "",
                }
              ]
            },
            //图片上传的数组
            tupians:[],
            sizeForm:{
                    title:'',
                    content:'',
            },
            sizeForm2:{
              title:'',
              content:'',
            },
            //存放获取复选框获取楼盘ID的
            multipleSelection: [],
            //存放地铁信息的数组
            subwaylist:[],
            //商圈的数组
            shangquan:[],
            //周边配套

            //交通情况


          }
         },
      methods:{
          getloupanlist(){
            loupanlist(this.form1).then( (res) =>{
              console.log(JSON.stringify(res.data))
              this.tableData= res.data.list;
              this.total=res.data.total;
            })
          },
        handleSizeChange(val) {
          console.log(`每页 ${val} 条`);
          this.form1.pageSize=val;
          this.getloupanlist();
        },
        handleCurrentChange(val) {
          console.log(`当前页: ${val}`);
          this.form1.pageNum=val;
          this.getloupanlist();
        },
        //获取所有的省
        getLists(){
          getlistsheng(this.form2).then((res)=>{
                  //console.log(JSON.stringify(res.data));
                  //alert(JSON.stringify(res));
            this.options=res;
            this.options5=res;
          })
        },//获取所有的市
        getshi(){
            this.form3.region_ID=this.form1.province;
            getlistsheng(this.form3).then((res)=>{
              this.options2=res;
            })

        },
        //获取所有的县城
        getxian(){
          this.form3.region_ID=this.form1.city;
          getlistsheng(this.form3).then((res)=>{
            this.options3=res;
          })

        },
        //获取所有的市
        getshi2(){
          this.form3.region_ID=this.ruleForm.province;
          getlistsheng(this.form3).then((res)=>{
            this.options6=res;
          })
            //同时获取所在市的那个地铁
            getshisubway(this.form3).then((res)=>{
              this.subwaylist=res;
            })
          console.log(this.subwaylist);


        },
        //获取所有的县城
        getxian2(){
          this.form3.region_ID=this.ruleForm.city;
          getlistsheng(this.form3).then((res)=>{
            this.options7=res;
          })


        },
        //去新增页面
        addone(){
              this.dialogVisible=true;
        },
        xiugai(){
            //先判断复选框是否有值
           // alert(JSON.stringify(this.multipleSelection))
          if(this.multipleSelection.length==0||this.multipleSelection.length>1){
            alert("复选框不能为0或多个,请选择一个");
            return;
          }else{
            this.dialogVisible2=true;
            //把数组里面的值赋值给我们绑定的
            this.ruleForm2=this.multipleSelection[0];

          }




        },
        addlf(){
          this.ruleForm.dynamicltem.push({
            total: "",
            content: ""})
        },
        removeDomain(item,index) {
          this.ruleForm.dynamicltem.splice(index, 1);
         // console.log(this.form.dynamicItem, "删除");
        },
        addlf2(){
          this.ruleForm.dynamicltem2.push({
            total: "",
            content: ""})
        },
        removeDomain2(item,index) {
          this.ruleForm.dynamicltem2.splice(index, 1);
          // console.log(this.form.dynamicItem, "删除");
        },//添加楼盘
        submit(){
             addloupan(this.ruleForm).then((res)=>{
            if(res){
              this.dialogVisible=false;
              this.getloupanlist();
            }else{
              alert("添加失败");
            }
          })
        },
        addtupian(file){
          addtupian(file).then((res)=>{
            alert(JSON.stringify(res));
          })
        },
        handleSelectionChange(val){
            this.multipleSelection=val;
           /* this.multipleSelection=[];
           val.forEach(row => {
            this.multipleSelection.push(row.id);
             });*/
        },
        //获取所有的商圈
        getshangquanDa(){
          getshangquan({code:this.ruleForm.county.toString()}).then((res)=>{
            this.shangquan=res;
          })
        },
        //获取商圈选中的值
       getsq(){
         alert(JSON.stringify(this.multipleSelection));
       },


      },
      mounted() {
          this.getloupanlist();
          this.getLists();
      }
    }
</script>

<style scoped>

</style>
